<template>
  <div>
    <a-descriptions :column="column">
      <a-descriptions-item v-for="(obj, i) in fieldArr" :key="i" :label="obj.label" :span="obj.span ? obj.span : 1">
        <!--//变更执行地-变更社区戒毒/社区康复执行地关系人情况-->
        <template v-if="obj.prop === 'contactsList' && businessType == 1">
          <a-table rowKey="id" :columns="contactsListColumns" :data-source="contactsListData" :pagination="false"
            bordered style="width:650px;" />
        </template>
        <!--//风险等级评估-查获吸毒记录-->
        <template v-if="obj.prop === 'drugSeizures' && businessType == 40">
          <a-table rowKey="id" :columns="drugSeizuresColumns" :data-source="drugSeizuresData" :pagination="false"
            bordered style="width:650px;" />
        </template>
        <!--//告警事件-任务模型-->
        <template v-if="obj.prop === 'taskModels' && businessType == 41">
          <div style="width:820px;" v-if="modelLists.length > 0">
            <div v-for="(item, index) in modelLists" class="single-model-container" :key="index"
              @click="pushModelRouter(item)">
              <a-tooltip placement="topLeft" :title="'点击跳转到' + item.name + '页'">
                <div class="single-model">
                  <div class="model-img-container">
                    <div class="model-img"><img :src="require('@/assets/ico/icon' + item.id + '.png')" alt="" /></div>
                  </div>
                  <div class="model-detail">
                    <div class="model-name-container" :title="item.name">{{ item.name }}</div>
                    <div class="model-remark" :title="item.description">{{ item.description }}</div>
                  </div>
                </div>
              </a-tooltip>
            </div>
          </div>
          <div v-else>无</div>
        </template>
        <!--//告警事件-目标对象-->
        <template v-if="obj.prop === 'taskUserLists' && businessType == 41">
          <z-table ref="table" rowKey="phoneNumber" bordered :showAlert="false" :showSelection="false"
            :loading="loading" :columns="taskUserListsColumns" :dataSource="pageData" @change="onTableChange"
            style="width:800px;" />
        </template>
        <template v-if="datas[obj.prop] && obj.prop === 'file'">
          <j-upload v-model="datas[obj.prop]" :disabled="true" class="upload-prop" />
        </template>
        <template
          v-else-if="datas[obj.prop] != '' && datas[obj.prop] != undefined && datas[obj.prop] != null || datas[obj.prop] === 0">
          {{ datas[obj.prop] }}
        </template>
        <template v-else>
          {{ obj.prop !== 'contactsList' && obj.prop !== 'drugSeizures' && obj.prop !== 'taskModels' && obj.prop !==
    'taskUserLists' ?
    '无' : null
}}
        </template>
      </a-descriptions-item>
    </a-descriptions>
    <div v-if="businessType == 1">
      生成模板文件:
      <a :href=approvalFrom target="_blank" >《变更社区戒毒社区康复执行地审批表》</a>
      <a :href=notice target="_blank" >，《变更社区戒毒社区康复执行地通知书》</a>
      <a :href=letter target="_blank" >，《关于变更社区戒毒社区康复执行地的函》</a>
    </div>
    <div v-if="businessType == 13">
      生成模板文件:
      <a :href=notice target="_blank" >《社区戒毒社区康复人员外出准假通知书》</a>
    </div>
    <div v-if="businessType==32">
      生成模板文件:
      <a :href=a>《小组工作计划书》</a>
      <a :href=b>、《小组工作（小节）计划书》</a>
    </div>
    <div v-if="businessType==37">
      生成模板文件:
      <a :href=c>《社区活动计划书》</a>
      <a :href=d>、《社区活动（小节）计划书》</a>
    </div>
    <div v-if="businessType == 40">
      生成模板文件:
      <a :href=templateFile target="_blank" >《风险等级评估审批表》</a>
    </div>
    <div v-if="businessType == 48">
      生成模板文件:
      <a :href=continueExplain target="_blank" >《继续执行社区戒毒社区康复情况说明》</a>
    </div>
  </div>
</template>

<script>
import * as flowServiceApi from '@/api/sjsk/flowService'
import { baseInformationMixin } from './baseInformationMixin'
export default {
  mixins: [baseInformationMixin],

  props: {
    businessType: {
      type: [String, Number],
      required: true
    },
    taskId: {
      type: [String, Number],
      require: true
    },
    approvalNumber: {
      type: [String, Number]
    },
    jsonParam: {
      type: Object
    }
  },
  data() {
    return {
      approvalFrom: '',
      notice: '',
      letter: '',
      a:'',
      b:'',
      c:'',
      d:'',
      templateFile: '',
      continueExplain: '',
      contactsListColumns: [
        { title: '姓名', dataIndex: 'contactsName' },
        {
          title: '关系', dataIndex: 'contactsRelationship',
          customRender: text => {
            return this.$options.filters.filterArray(text, this.contactsRelationshipOptions, 'key', 'title')
          }
        },
        { title: '联系电话', dataIndex: 'contactsPhone' },
        { title: '就业单位', dataIndex: 'contactsUnit' },
      ],
      contactsListData: [],
      drugSeizuresColumns: [
        { title: '查获时间', dataIndex: 'seizedDate' },
        {
          title: '查获单位', dataIndex: 'seizedUnit',
          customRender: text => {
            return this.$options.filters.filterArray(text, this.contactsRelationshipOptions, 'key', 'title')
          }
        },
        { title: '滥用毒品种类', dataIndex: 'drugCategory' },
        { title: '处置情况', dataIndex: 'contactsUnit' },
      ],
      drugSeizuresData: [],
      contactsRelationshipOptions: [
        { title: '夫妻', key: '1' },
        { title: '父子', key: '2' },
        { title: '父女', key: '3' },
        { title: '母子', key: '4' },
        { title: '母女', key: '5' },
        { title: '儿子', key: '6' },
        { title: '女儿', key: '7' },
        { title: '兄弟', key: '8' },
        { title: '兄妹', key: '9' },
        { title: '姐弟', key: '10' },
        { title: '姐妹', key: '11' },
        { title: '其他', key: '12' },
      ],
      modelList: [],
      taskUserListsColumns: [
        {
          title: '序号',
          dataIndex: 'order',
          scopedSlots: { customRender: 'order' },
          align: 'center',
          width: 100,
          customRender: (text, record, index) =>
            `${(this.pageFilter.pageNo - 1) * this.pageFilter.pageSize + (index + 1)}` //序号分页后连续
        },
        {
          title: '手机号',
          dataIndex: 'phoneNumber',
        },
        {
          title: '姓名',
          dataIndex: 'userName'
        },
        {
          title: '身份证号',
          dataIndex: 'card',
          customRender: (text, record, index) => {
            return text ? text : '--'
          }
        },
        {
          title: '社戒社康类型',
          dataIndex: 'phoneUserType',
          customRender: (text, record, index) => {
            return text ? this.$filterDictTextByCache('sjsk_type', text) : '--'
          }
        },
        {
          title: '执行时间',
          dataIndex: 'executionTime',
          customRender: (text, record, index) => {
            return record.executionStartTime && record.executionEndTime ? record.executionStartTime + '~' + record.executionEndTime : '--'
          }
        }
      ],
      loading: false,
      pageFilter: {
        pageNo: 1,
        pageSize: 10
      },
      pageData: [],
      datas: {}
    }
  },
  watch: {
    taskId: {
      immediate: true,
      deep: true,
      handler(val) {
        // if(this.businessType==1) this.getChangePlaceContactsDetail(val)
        if (this.businessType == 41) {
          this.getTaskQueryModel()
          this.getTaskModelDetails(val)
          this.getTaskUserDetails(val)
        }
      }
    },
    approvalNumber: {
      immediate: true,
      deep: true,
      handler(val) {
        this.$set(this.datas, 'approvalNumber', this.approvalNumber)
      }
    },
    jsonParam: {
      immediate: true,
      deep: true,
      handler(result) {
        // console.log("result")
        // console.log(result)
        if (this.businessType == 32 && result.main) {
          // this.jsonParam = result.main
          this.datas = Object.assign({}, this.datas, result.main)
          console.log('看这里');
          console.log(result.main);
        }
        // console.log(this.businessType)
        this.datas = Object.assign({}, this.datas, result)
        // 变更执行地-变更社区戒毒/社区康复执行地关系人情况
        if (this.businessType == 1) {
          this.approvalFrom = result.approvalFrom
          this.notice = result.notice
          this.letter = result.letter
          this.contactsListData = Object.keys(this.datas).length > 0 && this.datas.contactsList ? this.datas.contactsList : []
          this.$set(this.datas, 'contactsList', [])
        }
        if (this.businessType == 13) {
          this.notice = result.notice
        }
        // if(this.businessType==32) {
        //   this.a = result.a
        //   this.b = result.b
        // }
        // if(this.businessType==37) {
        //   this.c = result.c
        //   this.d = result.d
        // }
        if (this.businessType == 25) { //特殊人员
          // console.log(this.datas.mdqftTime)
          this.datas.mdkTime = this.getStrTime(this.datas.mdkTime) //免打卡签到时间
          this.datas.mnjTime = this.getStrTime(this.datas.mnjTime) //免定期尿液检测时间
          this.datas.mljTime = this.getStrTime(this.datas.mljTime) //免突击尿液检测时间
          this.datas.mdqftTime = this.getStrTime(this.datas.mdqftTime) //免定期访谈时间
          this.datas.hairInspect = this.getStrTime(this.datas.hairInspect) //毛发检测时间
        }
        if (this.businessType == 40) {
          this.templateFile = result.templateFile
        }
        if (this.businessType == 48) {
          this.continueExplain = result.continueExplain
        }
        this.getInfodictByValue()
      }
    }
  },
  computed: {
    column() {
      let column = 1
      if (this.fieldArr && this.fieldArr.length >= 12) column = 2
      return column
    },
    fieldArr() {
      let fieldArr = []
      // 2省内异地管控、5省外异地管控-转出省外
      if (this.businessType == 2 || this.businessType == 5) {
        fieldArr = this['fieldArr2']
        // 18取消常规尿液检测审批、19取消突击尿液检测审批、20取消常规毛发检测审批、21取消突击毛发检测审批
      } else if (this.businessType == 18 || this.businessType == 19 || this.businessType == 20 || this.businessType == 21) {
        fieldArr = this['fieldArr18']
        // 26季度评估审批、27年度评估审批
      } else if (this.businessType == 26 || this.businessType == 27) {
        fieldArr = this['fieldArr26']
        // 28季度评估补录审批、29年度评估补录审批
      } else if (this.businessType == 28 || this.businessType == 29) {
        fieldArr = this['fieldArr28']
      } else {
        fieldArr = this['fieldArr' + this.businessType]
      }
      return fieldArr
    },
    // 告警事件-任务模型
    modelLists() {
      let modelLists = []
      if (this.modelList.length > 0 && Object.keys(this.datas).length > 0 && this.datas['modelIdList']) {
        modelLists = this.modelList.filter(item => this.datas['modelIdList'].indexOf(item.id) > -1)
      }
      return modelLists
    }
  },
  methods: {
    getStrTime(text) {
      console.log(text)
      if (text != undefined || text != null) {
        let arr = text.split(';')
        let str = ""
        arr.forEach(item => {
          if (item != "") {
            let arr1 = item.split(',')
            str += arr1[0] + '~' + arr1[1] + ';  '
          }
        })
        return str;
      } else {
        return "--";
      }
    },
    // 变更执行地类型-基本信息-变更社区戒毒/社区康复执行地关系人情况
    getChangePlaceContactsDetail(taskId) {
      flowServiceApi.changePlaceContactsDetail(taskId).then((res) => {
        if (res.success) {
          const { result } = res
          this.contactsListData = result
        } else {
          this.$message.warn(res.message)
        }
      })
    },
    // 告警事件-全部任务模型列表
    getTaskQueryModel() {
      flowServiceApi.taskQueryModel().then(res => {
        if (res.success) {
          this.modelList = res.result
        }
      }).catch(e => {
        this.$message.warn('请求失败！')
      })
    },
    // 告警事件-获取taskId下模型id
    getTaskModelDetails() {
      flowServiceApi
        .taskModelDetails(this.taskId)
        .then(res => {
          if (res.success) {
            let result = res.result ? res.result : []
            this.$set(this.datas, 'modelIdList', result)
          }
        })
        .catch(e => {
          this.$message.warn('请求失败！')
        })
    },
    // 告警事件-获取taskId下目标对象列表
    getTaskUserDetails() {
      this.loading = true
      let obj = Object.assign({}, { taskId: this.taskId }, this.pageFilter)
      flowServiceApi
        .taskUserDetails(obj)
        .then(res => {
          this.loading = false
          if (res.success) {
            this.pageData = res.result ? res.result : {}
          } else {
            this.$message.warn(res.message ? res.message : '请求失败！')
          }
        })
        .catch(e => {
          this.loading = false
          this.$message.warn('请求失败！')
        })
    },
    // 告警事件-目标对象列表切换分页
    onTableChange(pagination, pageFilter, sorter) {
      this.pageFilter = Object.assign({}, this.pageFilter, pagination)
      this.getTaskUserDetails()
    },
    // 风险等级评估-获取吸毒查获情况
    getDrugSeizureDetails(personId, sources) {
      let obj = Object.assign({}, { personId: personId, sources: sources })
      flowServiceApi
        .viewDrugSeizure(obj)
        .then(res => {
          if (res.success) {
            this.drugSeizuresData = res.result ? res.result : []
          } else {
            this.$message.warn(res.message ? res.message : '请求失败！')
          }
        })
        .catch(e => {
          this.$message.warn('请求失败！')
        })
    },
    // 案事件任务模型跳转详情页
    pushModelRouter(item) {
      let modelRouters = [
        { id: 1, path: '/eventModal/historyTrack', name: '历史轨迹' },
        { id: 2, path: '/eventModal/latestLocation', name: '最新位置' },
        { id: 3, path: '/eventModal/figurePortrait', name: '人物画像' },
        { id: 4, path: '/eventModal/communicationBehavior', name: '通信行为' },
        { id: 5, path: '/eventModal/gangRelations', name: '团伙关系' },
      ]
      let routers = modelRouters.find(obj => { return obj.id === item.id }) || {}
      this.$router.push({
        path: routers.path,
        query: {
          taskId: this.taskId, // 任务id
          modelId: item.id //模型id
        }
      })
    }
  }
}
</script>
<style lang="less" scoped>
/deep/.undefined-item-content {
  color: #1890FF
}

:deep(.ant-descriptions-item-label) {
  min-width: 260px;
  text-align: right;
}

:deep(.ant-descriptions-item-content) {
  word-break: break-all;
  word-wrap: break-word;
}

:deep(.ant-descriptions-row > td) {
  padding-bottom: 10px;
  width: 100%;
}

:deep(.upload-prop .ant-upload-disabled) {
  display: none;
}

/deep/.ant-upload-disabled {
  display: none;
}

:deep(.ant-upload-list-item) {
  margin-top: 0;
}


.single-model-container {
  display: inline-block;
  position: relative;
  // width: 24%;
  cursor: pointer;
  margin: 5px 10px 0 0;
  border: 1px solid #e8e8e8;
  padding: 5px;
}

.single-model {
  height: 100px;
  margin: 5px auto;
  width: 248px;
  display: flex;
  align-items: center;
}

.model-img {
  height: 70px;
  width: 70px;
  margin-right: 10px;
  margin-top: 20px;
}

.model-img img {
  height: 100%;
  width: 100%;
  border-radius: 50%;
}

.model-img-container {
  display: inline-block;
  height: 100px;
}

.model-name-container {
  display: inline-block;
  width: 120px;
  font-size: 14px;
  font-weight: bold;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.model-remark {
  display: inline-block;
  height: 60px;
  /* overflow: hidden; */
  /* text-overflow: ellipsis; */
  /* white-space: nowrap; */
  /* width: 145px; */
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}

.model-detail {
  display: inline-block;
  // width: 125px;
  padding: 5px 10px;
}
</style>